<script type="text/javascript">
	var replicatePlayersCombo = function(which){
		$combo = $('.popup .combo #' + which).clone();
		$combo.removeClass('comboPlayers').addClass(which + 'Player').show();
		
		return $combo;
	};
	
	var addMatchesList = function(matches){
		count = $('.popup table.matches tbody tr').length + 1;
		$(matches).each(function(index, match){
			$match = $('<tr></tr>').addClass(count % 2 == 0 ? 'even' : 'odd');
			if (count == 3) $match.addClass('double');
			
			if (match.international_match_id > 0){
				$match.append($('<input type="hidden" class="matchId" value="' + match.international_match_id + '" />'));
				
				$match.append($('<td class="local-player"></td>').html(match.player1 + (sex == 'M' && count == 3 || sex == 'F' && count == 5 ? ' <br />' + match.player3 : '')));
				$match.append($('<td class="visitor-player"></td>').html(match.player2 + (sex == 'M' && count == 3 || sex == 'F' && count == 5 ? ' <br />' + match.player4 : '')));
				$match.append($('<td class="result-data"></td>').html('[ ' + match.result + ' ]'));
				
				$match.append($('<td class="to-modify"></td>').append($('<img>').attr('src', '<?= ADMINISTRATOR_IMAGE_PATH . 'edit_mini.png'; ?>').addClass('edit').on('click', function(){editMatch($(this));})));
			}else{
				$td = $('<td class="local-player player"></td>').append(replicatePlayersCombo('local').addClass('player1'));
				if (sex == 'M' && count == 3 || sex == 'F' && count == 5) $td.append(replicatePlayersCombo('local').addClass('player3'));
				$match.append($td);

				$td = $('<td class="local-player player"></td>').append(replicatePlayersCombo('visitor').addClass('player2'));
				if (sex == 'M' && count == 3 || sex == 'F' && count == 5) $td.append(replicatePlayersCombo('visitor').addClass('player4'));
				$match.append($td);

				$match.append($('<td class="result-data"></td>').append('<input type="text" class="result" id="result' + count + '" />'));
			}
			count++;
			
			$('.matches').append($match);
		});
	}

	var editMatch = function($caller){
		$row = $caller.closest('tr');
		$matchId = $row.find('.matchId').val();
		
		$combo = replicatePlayersCombo('local');
		$row.find('.local-player').text('').append($combo.attr('id', $matchId + '_' + $combo.attr('id')).addClass('player1'));
		if (isDoublesMatch($row)){
			$combo = replicatePlayersCombo('local');
			$row.find('.local-player').append($combo.attr('id', $matchId + '_' + $combo.attr('id')).addClass('player3'));
		}
		
		$combo = replicatePlayersCombo('visitor');
		$row.find('.visitor-player').text('').append($combo.attr('id', $matchId + '_' + $combo.attr('id')).addClass('player2'));
		if (isDoublesMatch($row)){
			$combo = replicatePlayersCombo('visitor');		
			$row.find('.visitor-player').append($combo.attr('id', $matchId + '_' + $combo.attr('id')).addClass('player4'));
		}
		
		$row.find('.result-data').text('').append($('<input type="text" name="result" class="result" />'));
		$row.find('img').parent().remove();
	};
	
	var isAbleToCreateMatch = function(currentMatches){
		if (currentMatches == 5){
			alert('No puede ingresar m\u00E1s de 5 partidos por serie');
			return 0;
		}
		return 1;
	};
	
	var adaptContainer = function(currentMatches){
		additionHeight = currentMatches == 2 ? 86 : 43; 
		currentHeight = $('#matches').css('height');
		currentHeight = currentHeight.split('px');
		$.each([$('#matchesDescription'), $('#matches')], function(){
			this.append(HTML);
			this.css('height', (parseInt(currentHeight[0]) + additionHeight) + 'px');
		});
	};
	
	var isDoublesMatch = function($row){
		return $row.hasClass('double');
	}
	
	var generateMatchesForm = function(){
		matches = [ ];
		$('.popup .matches tbody tr').each(function(key, element){
			playersArr = [];
			for (i =0; i <= 4; i++) 
				playersArr[i] = $(element).find('select.player' + i).length > 0 ? $(element).find('select.player' + i).val() : null;

			matches.push({
				id : ($(element).find('.matchId').length > 0 ? $(element).find('.matchId').val() : null),
				players : playersArr,
				result : ($(element).find('input.result').length > 0 ? $(element).find('input.result').val() : null)
			});
		});

		return matches;
	};
	
	$(function(){
		$('#addInternationalMatchToSerie').live('click', function(){
			currentMatches = $('.popup table.matches tbody tr').length + 1;
			if (currentMatches > 3)
				currentMatches--;

			if (isAbleToCreateMatch(currentMatches)){
				addMatchesList([{international_match_id: 0}]); /*Sending empty match*/
			}
		});
		
		
		$('.popup .matches .delete').live('click', function(){
			$(this).parent().remove();
		});

		$('[name=sbmMatch]').live('click', function(){
		data = {};
			$('#frmCreateMatches > input[type=hidden]').each(function(key, element){
				eval('data.' + $(element).attr('id') + ' = "' + $(element).val() + '"'); 
			});
			data.matches = generateMatchesForm();
			
			$.ajax({
				url: '<?=ADMINISTRATOR_CONTROLLER_PATH; ?>operations.php',
				type: 'post',
				data: data,
				success: function(data){
					window.location.reload();
				}
			});
			return false;
		});
	
		$('.popup .close-button').click(function(){
			if (closePopup)
				closePopup($(this).closest('.popup'));
		});
	});
</script>

<div id="playersPopup" class="popup hidden">
	<div id="closePopup" class="close-button"><img src="<?= ADMINISTRATOR_IMAGE_PATH . 'close.png'; ?>" /></div>
	<div class="clear"></div>
	<div id="popupContent">
		<form id="frmCreateMatches" class="form" method="post">
			<input type="hidden" name="tournament_id" id="tournament_id_popup" />
			<input type="hidden" name="country1" class="countryId" id="country1" />
			<input type="hidden" name="country2" class="countryId" id="country2" />
			<input type="hidden" name="serie_id" id="serie_id" />
			<input type="hidden" name="controller" id="controller" value="matches" />
			<input type="hidden" name="operation" id="operation" value="insertInternationalMatches" />

			<div id="matchesTitle" class="title"><span></span></div>
			<div id="matchesCombo" class="combo"></div>
			<div id="matchesContainer">
				<table id="matches" class="popupContent matches">
					<thead>
						<tr>
							<td>Local</td>
							<td>Visitante</td>
							<td>Resultado</td>
							<td class="to-modify"></td>
						</tr>
					</thead>
					
					<tbody>
					</tbody>
				</table>
				<div class="clear"></div>
				<div id="addInternationalMatchToSerie" class="to-modify">A&ntilde;adir partido +</div>
				<div class="clear"></div>
			</div>
			<div id="button" class="to-modify"><input type="button" name='sbmMatch' value='Aceptar' /></div>
		</form>
	</div>
</div>